/* eslint-disable react-hooks/exhaustive-deps */
import React, { useEffect } from 'react'
import { useSelector, useDispatch } from 'react-redux'
import avatar from '../assets/back.jpg'
import { getNewsList } from '../store/actions/newsList'
export default function NewsList () {
  const activeId = useSelector((state) => state.channel.activeId)
  // 拿数据
  const newsList = useSelector((state) => state.news)
  const dispatch = useDispatch()
  useEffect(() => {
    console.log('新闻列表', activeId)

    dispatch(getNewsList(activeId))
  }, [])
  return (
    <div className="list">
      {newsList.map((it) => (
        <div key={it.art_id} className="article_item">
          <h3 className="van-ellipsis">{it.title}</h3>
          <div className="img_box">
            <img
              src={it.cover.type ? it.cover.images[0] : avatar}
              className="w100"
              alt=""
            />
          </div>
          <div className="info_box">
            <span>{it.aut_name}</span>
            <span>{it.comm_count}评论</span>
            <span>{it.pubdate}</span>
          </div>
        </div>
      ))}
    </div>
  )
}
